<template>
    <div class="app-container">
        <el-tabs v-model="activeTab">
            <el-tab-pane label="表单" name="first">
                <el-form :model="form">
                    <el-form-item label="Name">
                        <el-input v-model="form.name"></el-input>
                    </el-form-item>
                    <el-form-item label="Email">
                        <el-input v-model="form.email"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submitForm">Submit</el-button>
                    </el-form-item>
                </el-form>
            </el-tab-pane>
            <el-tab-pane label="流转记录" name="second">
                <flowRecordList></flowRecordList>
            </el-tab-pane>
            <el-tab-pane label="流程图" name="third">
                <flowViewer/>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
import flowRecordList from '../flowRecordList.vue';
import flowViewer from '../flowViewer.vue';
export default {
    components: {
        flowRecordList,
        flowViewer
    },
    data() {
        return {
            activeTab: 'first',
            form: {
                name: '',
                email: ''
            }
        };
    },
    methods: {
        submitForm() {
            console.log('Form submitted:', this.form);
        }
        
    }
};
</script>

<style scoped>
/* Add any custom styles here */
</style></div>